<template>
    <ul class="todolist_warp">
        <li v-for="(item, index) in listdata" :key="index">
            <img src="../../../assets/image/home/jg.png" alt="">
            <div class="todolist_warp_lis_title">
                <span>
                    {{ item.label }}
                </span>
                <span style="margin-top:0.1rem;color:#D81E06">{{ item.title }}</span>
            </div>
        </li>
    </ul>
</template>

<script setup>
import { ref, onMounted, reactive, nextTick } from "vue";
const props = defineProps({
    listdata: {
        type: Object,
        default: [],
    }
});
</script>

<style lang="less" scoped>
.todolist_warp {
    padding: 0;
    margin: 0;
    height: calc(100% - 1rem);
    overflow-y: auto;

    li {
        list-style: none;
        height: 2.4rem;
        display: flex;
        padding-left: 1.5rem;
        margin-bottom: 0.6rem;
        align-items: center;

        img {
            width: 1rem;
            height: 1rem;
            margin-right: 1rem;
        }

        .todolist_warp_lis_title {
            display: flex;
            flex-wrap: wrap;
            width: 75%;

            span {
                width: 100%;
                font-size: 0.8rem;
                color: #fff;
            }
        }
    }
}
</style>